<template>
  <div>
    <button @click="wins">点击弹出 confirm</button>
    <confirm ref="conf" :text="text" @cancel="canc" @confirm="confr"></confirm>
    <switches :switches="switches" :currentIndex="currentIndex" @switch="selsItem"></switches>
    <router-link to="/backtop">返回顶部</router-link>
    <router-link to="/header">header 页面</router-link>
    <loading></loading>
  </div>
</template>
<style scoped lang="stylus" rel="stylesheet/stylus">

</style>
<script type="text/ecmascript-6">
  import Confirm from 'base/confirm/confirm'
  import Switches from 'base/switches/switches'
  import Loading from 'base/loading/loading'
  export default{
    data () {
      return {
        text: '这是一个弹出窗内容',
        switches: [
          {name: '选项一'},
          {name: '选项二'},
          {name: '选项三'}
        ],
        currentIndex: 0
      }
    },
    methods: {
      wins() {
        this.$refs.conf.show()
      },
      canc() {
        console.log('你点击了取消按钮')
      },
      confr() {
        console.log('你点击了确定')
      },
      selsItem(index) {
        this.currentIndex = index
      }
    },
    components: {
      Confirm,
      Switches,
      Loading
    }
  }
</script>
